<script setup lang="ts">
const { title = '-' } = defineProps<{
  title?: string
}>()

const emits = defineEmits<{
  'leftClickHandler': [title: string]
}>()
</script>

<template>
  <div class="navbar">
    <button @click="emits('leftClickHandler',title)">左按钮</button>
    <h3>{{ title }}</h3>
    <!-- 插槽：接受传递过来的结构，相当于鸿蒙里面的 BuilderParam  -->
    <!-- 插槽可设置默认内容 -->
    <slot>默认内容</slot>
  </div> 
</template>

<style scoped>
.navbar {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  background-color: blueviolet;
}
</style>